<ui:composition template="../template/plantilla_01.xhtml"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:p="http://primefaces.org/ui">

    <ui:define name="head">
        <style type="text/css">
            .ui-panelGrid {
                    background-color: #82c100;
                    background-image: none;
                    -moz-border-radius: 2px;
                    -webkit-border-radius: 2px;
                    border-radius: 2px;
                    behavior: url(ie-css3.htc);
                    border: 0px;
                    color: white;

            }
          
        </style>
    </ui:define>

    <ui:define name="panelCentral" >
        
        <h:form prependId="false" >
            
            
            <p:panel style="min-height: 400px;height: auto;" >
                <div class="ui-panel-titlebar">Ventas Especiales 
                    <div style="float:right;">
                        <img src="http://www.intercap.com.ar/imagenes/iconos/info-ayuda.png" title="Información general sobre el estado de las Ventas Especiales"/>
                    </div>
                </div>
                  <p:messages showDetail="true" />
                 
                <h:panelGrid columns="2" border="0" style="width: 500px;"
                             styleClass="panel-consulta" columnClasses="colIcono,colTitulo"
                             rendered="#{not empty poolClienteBean.reservasConfirmadas}" >

                    <h:panelGroup layout="block" >

                        <p:graphicImage id="imgActivos" value="#{aplicacionBean.parametro.pathImagenesDefault}/iconos/icono_masinfo.png" style="cursor:pointer"/>
                        <p:tooltip for="imgActivos" style="width: 600px; font-size: 12px; padding: 10px;" >

                            <h:outputText value="Sus reservas en ventas especiales activas" styleClass="headerTable" />
                            <br/>
                            <h:outputText value="Son las reservas que usted ha realizado en ventas especiales que actualmente
                                          se encuentran activas. Si la venta finaliza con éxito, su reserva se convertirá
                                          en un pedido, estableciendo así el compromiso de compra." />

                        </p:tooltip>
                    </h:panelGroup>

                    <h:outputText value="Sus reservas en ventas especiales activas"   />
                </h:panelGrid>

                <!-- Tabla reservas pendientes -->
                <p:dataTable id="reservasPendiente" var="r" value="#{poolClienteBean.reservasConfirmadas}"
                             rendered="#{not empty poolClienteBean.reservasConfirmadas}"
                             rows="10" paginator="true" paginatorAlwaysVisible="false"
                             style="padding-top: 5px;">

                    <p:column headerText="Nro" style="text-align: right; width: 30px;" >
                        <h:outputText value="#{r.nroPool}" >
                            <f:convertNumber pattern="0000" />
                        </h:outputText>
                    </p:column>
                    
                    <p:column headerText="Tipo" style="text-align: right; width: 70px;" >
                        <h:outputText value="#{r.pool.tipo.descrp}" />                                                    
                    </p:column>

                    <p:column headerText="Descripción" >
                        <h:outputText value="#{r.pool.descripcion}" />
                    </p:column>

                    <p:column headerText="Condición de pago" >
                        <h:outputText value="#{r.condicionDePago.descrp}" />
                    </p:column>

                    <p:column headerText="Disponible hasta" style="width: 120px;" >
                        <h:outputText value="#{r.pool.disponibleHasta}" >
                            <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" />
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Cant. Disponible" style="width: 80px; text-align: right;" >
                        <h:outputText value="#{r.pool.cantidadDisponible}" >
                            <f:convertNumber pattern="0"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Detalle" style="text-align: center; width: 50px;" >
                        <p:rowToggler />
                    </p:column>

                    <p:column headerText="Anular" style="text-align: center; width: 50px;" >
                        <p:commandButton icon="delete24"
                                         actionListener="#{poolClienteBean.anularReserva(r)}"
                                         process="@this"
                                         update="@form" />
                    </p:column>

                    <p:rowExpansion>

                        <p:dataTable value="#{r.itemReservas}" var="i"
                                     style="margin: 5px; width: 600px; float: right;">
                            <p:column headerText="Producto">
                                <h:outputText value="#{i.producto.descrp}" />
                            </p:column>

                            <p:column headerText="Precio Unit." style="text-align: right; width: 70px;">
                                <h:outputText value="#{i.precio}" >
                                    <f:convertNumber pattern="0.00" />
                                </h:outputText>
                            </p:column>

                            <p:column headerText="Cantidad" style="text-align: right; width: 60px;" >
                                <h:outputText value="#{i.cantidad}" >
                                    <f:convertNumber pattern="0"/>
                                </h:outputText>
                            </p:column>

                        </p:dataTable>
                    </p:rowExpansion>

                </p:dataTable>

                <p:spacer style="width: 100%" height="20" rendered="#{not empty poolClienteBean.reservasPedidoGenerado}" />

                <h:panelGrid columns="2" border="0" style="width: 500px;"
                             styleClass="panel-consulta" columnClasses="colIcono,colTitulo"
                             rendered="#{not empty poolClienteBean.reservasPedidoGenerado}" >

                    <h:panelGroup layout="block" >
                        <p:graphicImage id="imgConfirmado" value="#{aplicacionBean.parametro.pathImagenesDefault}/iconos/icono_masinfo.png" style="cursor:pointer"/>
                        <p:tooltip for="imgConfirmado" style="width: 600px; font-size: 12px;">
                            <h:panelGrid columns="1" >
                                <h:outputText value="Sus reservas en ventas especiales finalizadas" styleClass="headerTable" />
                                <h:outputText value="Son las reservas que usted ha realizado en ventas especiales finalizadas exitosamente.
                                              Estas reservas ya fueron procesadas y se ha generado su pedido." />
                            </h:panelGrid>
                        </p:tooltip>
                    </h:panelGroup>

                    <h:outputText value="Sus Reservas en ventas especiales finalizadas" style="color:#cc0000;"  />

                </h:panelGrid>

                <!-- Tabla reservas confirmadas -->
                <p:dataTable id="reservasConfirmadas" var="r" value="#{poolClienteBean.reservasPedidoGenerado}"
                             rendered="#{not empty poolClienteBean.reservasPedidoGenerado}"
                             style="padding-top: 5px;"
                             rows="10" paginator="true" paginatorAlwaysVisible="false">

                    <p:column headerText="Nro" style="text-align: right; width: 30px;" >
                        <h:outputText value="#{r.nroPool}" >
                            <f:convertNumber pattern="0000" />
                        </h:outputText>
                    </p:column>
                    
                    <p:column headerText="Tipo" style="text-align: right; width: 70px;" >
                        <h:outputText value="#{r.pool.tipo.descrp}" />                            
                    </p:column>

                    <p:column headerText="Descripción" >
                        <h:outputText value="#{r.pool.descripcion}" />
                    </p:column>

                    <p:column headerText="Condición de pago" >
                        <h:outputText value="#{r.condicionDePago.descrp}" />
                    </p:column>

                    <p:column headerText="Pedido Generado" >
                        <h:outputText value="#{r.pedido.id.codfor} - #{r.pedido.id.nrofor}" />
                    </p:column>

                    <p:column headerText="Detalle" style="text-align: center; width: 50px;" >
                        <p:rowToggler />
                    </p:column>

                    <p:rowExpansion>

                        <p:dataTable value="#{r.itemReservas}" var="i"
                                     style="margin: 5px; width: 600px; float: right;">
                            <p:column headerText="Producto">
                                <h:outputText value="#{i.producto.descrp}" />
                            </p:column>

                            <p:column headerText="Precio Unit." style="text-align: right; width: 70px;">
                                <h:outputText value="#{i.precio}" >
                                    <f:convertNumber pattern="0.00" />
                                </h:outputText>
                            </p:column>

                            <p:column headerText="Cantidad" style="text-align: right; width: 60px;" >
                                <h:outputText value="#{i.cantidad}" >
                                    <f:convertNumber pattern="0"/>
                                </h:outputText>
                            </p:column>

                        </p:dataTable>

                    </p:rowExpansion>

                </p:dataTable>

                <p:spacer style="width: 100%" height="20" rendered="#{not empty poolClienteBean.reservasNoCerradas}" />

                <h:panelGrid columns="2" border="0" style="width: 500px;background-color: #999999;"
                             styleClass="panel-consulta" columnClasses="colIcono,colTitulo"
                             rendered="#{not empty poolClienteBean.reservasNoCerradas}" >

                    <h:panelGroup layout="block" >
                        <p:graphicImage id="imgNoCerrado" value="#{aplicacionBean.parametro.pathImagenesDefault}/iconos/icono_masinfo.png" style="cursor:pointer"
                                    width="32" height="32"/>
                        <p:tooltip for="imgNoCerrado" style="width: 600px; font-size: 12px;">
                            <h:panelGrid columns="1" >
                                <h:outputText value="Sus Reservas en ventas especiales no cerradas" styleClass="headerTable" />
                                <h:outputText value="Son las reservas que usted ha realizado en ventas especiales que por no cumplirse
                                              las condiciones de las mimas, no finalizaron de manera exitosa, quedando
                                              sin efecto su reserva." />
                            </h:panelGrid>
                        </p:tooltip>
                    </h:panelGroup>

                    <h:outputText value="Sus Reservas en ventas especiales no cerradas" />

                </h:panelGrid>

                <p:dataTable id="reservasNoCerradas" var="r" value="#{poolClienteBean.reservasNoCerradas}"
                             rendered="#{not empty poolClienteBean.reservasNoCerradas}"
                             style="padding-top: 5px; "
                             rows="10" paginator="true" paginatorAlwaysVisible="false">

                    <p:column headerText="Nro" style="text-align: right; width: 30px;" >
                        <h:outputText value="#{r.nroPool}" >
                            <f:convertNumber pattern="0000" />
                        </h:outputText>
                    </p:column>
                    
                    <p:column headerText="Tipo" style="text-align: right; width: 70px;" >
                        <h:outputText value="#{r.pool.tipo.descrp}" /> 
                    </p:column>

                    <p:column headerText="Descripción" >
                        <h:outputText value="#{r.pool.descripcion}" />
                    </p:column>

                    <p:column headerText="Condición de pago" >
                        <h:outputText value="#{r.condicionDePago.descrp}" />
                    </p:column>

                    <p:column headerText="Cant. ofrecidas" >
                        <h:outputText value="#{r.pool.cantidadTotal}" >
                            <f:convertNumber pattern="0"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Cant. no reservadas" >
                        <h:outputText value="#{r.pool.cantidadDisponible}" >
                            <f:convertNumber pattern="0"/>
                        </h:outputText>
                    </p:column>

                    <p:column headerText="Detalle" style="text-align: center; width: 50px;" >
                        <p:rowToggler />
                    </p:column>

                    <p:rowExpansion>

                        <p:dataTable value="#{r.itemReservas}" var="i"
                                     style="margin: 5px; width: 600px; float: right;">
                            <p:column headerText="Producto">
                                <h:outputText value="#{i.producto.descrp}" />
                            </p:column>

                            <p:column headerText="Precio Unit." style="text-align: right; width: 70px;">
                                <h:outputText value="#{i.precio}" >
                                    <f:convertNumber pattern="0.00" />
                                </h:outputText>
                            </p:column>

                            <p:column headerText="Cantidad" style="text-align: right; width: 60px;" >
                                <h:outputText value="#{i.cantidad}" >
                                    <f:convertNumber pattern="0"/>
                                </h:outputText>
                            </p:column>

                        </p:dataTable>

                    </p:rowExpansion>

                </p:dataTable>

                <p:spacer style="width: 100%" height="20" rendered="#{not empty poolClienteBean.reservasAnuladas}" />

                <h:panelGrid columns="2" border="0" style="width: 500px;"
                             styleClass="panel-consulta" columnClasses="colIcono,colTitulo"
                             rendered="#{not empty poolClienteBean.reservasAnuladas}" >

                    <h:panelGroup layout="block" >
                        <p:graphicImage id="imgAnulado" value="#{aplicacionBean.parametro.pathImagenesDefault}/iconos/icono_masinfo.png" style="cursor:pointer"/>
                        <p:tooltip for="imgAnulado" style="width: 600px; font-size: 12px;">
                            <h:panelGrid columns="1" >
                                <h:outputText value="Sus Reservas anuladas" styleClass="headerTable" />
                                <h:outputText value="Son las reservas que usted ha realizado en ventas especiales que por no cumplirse
                                              las condiciones de las mimas, no finalizaron de manera exitosa, quedando
                                              sin efecto su reserva." />
                            </h:panelGrid>
                        </p:tooltip>
                    </h:panelGroup>

                    <h:outputText value="Sus Reservas anuladas" style="color:#0044cc;"  />

                </h:panelGrid>

                <p:dataTable id="reservasAnuladas" var="r" value="#{poolClienteBean.reservasAnuladas}"
                             rendered="#{not empty poolClienteBean.reservasAnuladas}"
                             style="padding-top: 5px;"
                             rows="10" paginator="true" paginatorAlwaysVisible="false" >

                    <p:column headerText="Nro" style="text-align: right; width: 30px;" >
                        <h:outputText value="#{r.nroPool}" >
                            <f:convertNumber pattern="0000" />
                        </h:outputText>
                    </p:column>
                    
                    <p:column headerText="Tipo" style="text-align: right; width: 70px;" >
                        <h:outputText value="#{r.pool.tipo.descrp}" /> 
                    </p:column>

                    <p:column headerText="Descripción" >
                        <h:outputText value="#{r.pool.descripcion}" />
                    </p:column>

                    <p:column headerText="Condición de pago" >
                        <h:outputText value="#{r.condicionDePago.descrp}" />
                    </p:column>

                    <p:column headerText="Detalle" style="text-align: center; width: 50px;" >
                        <p:rowToggler />
                    </p:column>

                    <p:rowExpansion>

                        <p:dataTable value="#{r.itemReservas}" var="i"
                                     style="margin: 5px; width: 600px; float: right;">
                            <p:column headerText="Producto">
                                <h:outputText value="#{i.producto.descrp}" />
                            </p:column>

                            <p:column headerText="Precio Unit." style="text-align: right; width: 70px;">
                                <h:outputText value="#{i.precio}" >
                                    <f:convertNumber pattern="0.00" />
                                </h:outputText>
                            </p:column>

                            <p:column headerText="Cantidad" style="text-align: right; width: 60px;" >
                                <h:outputText value="#{i.cantidad}" >
                                    <f:convertNumber pattern="0"/>
                                </h:outputText>
                            </p:column>

                        </p:dataTable>

                    </p:rowExpansion>
                </p:dataTable>

            </p:panel>

        </h:form>
      
  </ui:define>
    
</ui:composition>